import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/page/base_page_state.dart';

class OrderListPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return OrderListState();
  }
}

class OrderListState extends BasePageState<OrderListPage> {
  @override
  void initState() {
    super.initState();
    appBarController.title = '我的订单';
  }

  @override
  Widget buildBody(BuildContext context) {
    return DefaultTabController(
        length: 6,
        child: Column(
          children: <Widget>[
            Container(
              color: Theme.of(context).primaryColor,
                child: PreferredSize(
                  preferredSize: Size.fromHeight(44),
                  child: TabBar(
                    labelColor: Colors.white,
                    unselectedLabelColor: Colors.white70,
                    indicatorWeight: 3,
                    indicatorColor: Colors.white,
                    isScrollable: true,
                    labelStyle: TextStyle(fontSize: 16),
                    tabs: <Widget>[
                      Tab(text: '全部'),
                      Tab(text: '已支付'),
                      Tab(text: '配送中'),
                      Tab(text: '已收货'),
                      Tab(text: '已取消'),
                      Tab(text: '待支付')
                    ],
                  ),
                )
            ),
            Expanded(
              child: TabBarView(
                children: <Widget>[
                  _buildOrderList(),
                  _buildOrderList(),
                  _buildOrderList(),
                  _buildOrderList(),
                  _buildOrderList(),
                  _buildOrderList()
                ],
              ),
            )
          ],
        ));
  }

  Widget _buildOrderList() {
    return ListView.separated(
      itemBuilder: _buildOrderItem,
      separatorBuilder: (BuildContext context, int index) {
        return Container(
          color: Colors.black12,
          height: 0.5,
        );
      },
      itemCount: 10,
    );
  }

  Widget _buildOrderItem(BuildContext context, int index) {
    return InkWell(
        child: Container(
            padding: EdgeInsets.symmetric(vertical: 10, horizontal: 15),
            child: Row(
              children: <Widget>[
                CachedNetworkImage(
                  width: 80,
                  height: 80,
                  imageUrl: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1531798262708&di=53d278a8427f482c5b836fa0e057f4ea&imgtype=0',
                  fit: BoxFit.cover,
                ),
                Expanded(
                    child: Padding(
                        padding: EdgeInsets.only(left: 10),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: <Widget>[
                            Text('这是一个主标题，关于橘子',
                                style: TextStyle(fontSize: 16)
                            ),
                            Padding(
                              padding: EdgeInsets.only(top: 5),
                              child: Text(
                                  '这是一个副标题，🍊橘子是秋季成长的水果，可以去热，补充维生素C，增强身体抵抗力',
                                  style: TextStyle(
                                      fontSize: 14, color: Colors.black54)
                              ),
                            ),
                          ],
                        )
                    )
                )
              ],
            )
        )
    );
  }
}
